@use "sass:map";

// 断点映射
$breakpoints: (
  'xs': 480px,
  'sm': 576px,
  'md': 768px,
  'lg': 992px,
  'xl': 1200px,
  'xxl': 1600px,
);

// 获取断点值
@function breakpoint($key) {
  @return map.get($breakpoints, $key);
}

// 响应式 mixin
@mixin responsive($breakpoint) {
  @media (min-width: #{breakpoint($breakpoint)}) {
    @content;
  }
}

// 简易的阴影 mixin
@mixin box-shadow($level: 1) {
  @if $level == 1 {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  } @else if $level == 2 {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
  } @else if $level == 3 {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  }
}

// 文本截断
@mixin text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
